@extends('edu::layouts.member')

@push('scripts')
    <script src="https://cdn.bootcdn.net/ajax/libs/hls.js/8.0.0-beta.3/hls.min.js"></script>

    <script>
        let video = document.getElementById('video');
        let videoSrc = "{{$config['play']['hls'] ?? '' }}";

        if (Hls.isSupported()) {
            var hls = new Hls();
            hls.loadSource(videoSrc);
            hls.attachMedia(video);

        } else if (video.canPlayType('application/vnd.apple.mpegurl')) {
            video.src = videoSrc;
        }
    </script>
@endpush
@section('content')
    <div class="card shadow-sm">
        <div class="card">
            <div class="card-header bg-white">
                我的直播
            </div>
            <div class="card-body">
                <div style="background: #22262f">
                    <video id="video" width="100%" autoplay muted controls></video>
                </div>

                <div class="mt-3" id="app">
                    <div class="bg-white p-3 shadow-sm border">
                        <div class="alert alert-secondary" role="alert">
                            请在10分钟内使用
                        </div>
                        <form action="{{route('common.live.push')}}" method="post">
                            @csrf
                            <x-form name="title" title="直播标题" value="{{old('title',$config['title']??'')}}"></x-form>
                            <x-form theme="textarea" name="description"
                                    title="直播描述">{{old('description',$config['description']??'')}}</x-form>
                            <x-form theme='image' title='预览图' name='preview' action='{{ route("admin.config.upload") }}'
                                    value="{{ $config['preview']??'' }}">
                            </x-form>
                            {{--                           推流地址和 key 只是展示，并不向后台推数据--}}
                            <x-form name="a" title="推流服务器" disabled="disabled"
                                    value="{{$config['push']['url'] ?? ''}}"></x-form>
                            <x-form name="a" title="串流密钥" disabled="disabled"
                                    value="{{$config['push']['key'] ?? ''}}"></x-form>

                            {{--                                <x-form name="b" title="播流RTMP地址"--}}
                            {{--                                        value="{{config('module.play.rtmp')}}"></x-form>--}}
                            {{--                                <x-form name="b" title="播流FLV地址" value="{{config('module.play.flv')}}"></x-form>--}}
                            {{--                                <x-form name="b" title="播流M3U8地址"--}}
                            {{--                                        value="{{config('module.play.hls')}}"></x-form>--}}

                            <button class="btn btn-primary mt-3">推流</button>
                        </form>

                    </div>
                    {{--房管设置--}}

                    <set-live-admin action="{{route('liveAdmin.search')}}"></set-live-admin>
                {{--                房管设置结束--}}

                </div>

            </div>

        </div>
    </div>
@endsection

